@charset "utf-8";
@import 'reset';
$fontSize:40;
@function r($p) {
    @return $p/$fontSize*1rem;
}
@font-face {
  font-family: 'iconfont';  /* project id 1019516 */
  src: url('//at.alicdn.com/t/font_1019516_kms5dmqlyg.eot');
  src: url('//at.alicdn.com/t/font_1019516_kms5dmqlyg.eot?#iefix') format('embedded-opentype'),
  url('//at.alicdn.com/t/font_1019516_kms5dmqlyg.woff2') format('woff2'),
  url('//at.alicdn.com/t/font_1019516_kms5dmqlyg.woff') format('woff'),
  url('//at.alicdn.com/t/font_1019516_kms5dmqlyg.ttf') format('truetype'),
  url('//at.alicdn.com/t/font_1019516_kms5dmqlyg.svg#iconfont') format('svg');
}
html {
    font-size: $fontSize*1px;
    width: 100%;
    height: 100%;
    overflow: hidden;
}
body{
    font-size: 16px;
    width: 100%;
    height: 100%;
    overflow: hidden;
}
.webWarp{
    height: 100%;
    overflow: auto;
}
.web {
    width: r(640);
    margin-bottom: r(80);
   
    header {
        .search{
            display: flex;
            justify-content: space-around;
            align-items: center;
            margin-top: r(14);
            img{
                height: r(38);
            }
            .sea_input{
                width: r(520);
                height: r(50);
                line-height: r(45);
                vertical-align: middle;
                text-align: center;
                background: #F2F2F2;
                border-radius: r(10);
                input{
                    width: r(500);
                    height: r(40);
                    font-size: r(30);
                    vertical-align: middle;
                    text-align: center;
                    background: #F2F2F2;
                    border: none;
                }
            }
        }
        .nav{
            ul{
                display: flex;
                justify-content: space-around;
                align-items: center;
                margin-top: r(28);
                border-bottom: r(1) solid #ab9e9e;
                
                li{
                    display: flex;
                    align-items: center;

                    a{
                       padding: 0 r(28) r(11) r(27); 
                       font-size: r(27);
                       color: #343434;
                       position: relative;
                    }
                    .active:after{
                        content: "";
                        position: absolute;
                        width: 100%;
                        height: r(2);
                        background: #333333;
                        left: 0;
                        bottom: 0;
                    }
                    a:hover:after{
                        content: "";
                        position: absolute;
                        width: 100%;
                        height: r(2);
                        background: #333333;
                        left: 0;
                        bottom: 0;
                    }
                    a:hover{
                        color: #3498DB;
                    }
                }
            }
        }
        
    }
    .container{
        width: r(640);
       .content{
           
           display: flex;
           justify-content: space-between;
           align-items: center;
           margin-top: r(14);
           .con_left{
               padding-left: r(14);
//             width: r(312);
               display: flex;
               justify-content: space-between;
               >img{
                   height: r(58);
               }
               .data{
                   padding-left: r(10);
               }
               .lf_name{
//                 width: r(240);
                   display: flex;
                   justify-content: space-between;
                   align-items: center;
                   .name{
                       font-size: r(24);
                       color: #343434;
                       line-height: r(24);
                   }
                   .lf_label{
//                     width: r(49);
                       padding: r(5) r(10);
                       height: r(25);
                       line-height: r(12);
                       font-size: r(12);
                       border-radius:r(10);
                       border: 1px solid #E5E5E5;
                       text-align: center;
                       color: #9A9A9A;
                   }
                   
               }
               .icon{
                   margin-top: r(7);
                   ul{
                       width: r(240);
                       display: flex;
                       justify-content: space-between;
                       align-items: center;
                       li{
                           display: flex;
                           align-items: center;
                           .yan{
                               height: r(19);
                           }
                           .bj{
                               height: r(21);
                           }
                           .jhy{
                               width: r(25);
                           }
                           span{
                               padding-left: r(8);
                               color: #9A9A9A;
                               font-size: r(20);
                           }
                       }
                   }
               }
           }
           .con_right{
               margin-right: r(28);
               img{
                   width: r(25);
               }
           }
       }
       .image{
           display: flex;
           justify-content: space-between;
           align-items: center;
           margin-top: r(12);
           margin-bottom: r(15);
           img{
               width: r(212);
           }
       }
    }
}
    footer{
        width: 100%;
    .foot_nav{
        width: r(584);
        position: absolute;
        left:50%;
        bottom:0;
        transform: translate(-50%);
        ul{
            display: flex;
            justify-content: space-between;
            align-items: flex-end;
            li{
                display: flex;
                align-items: flex-end;
                a{
                    display: flex;
                    align-items: flex-end;  
                }
                img{
                    width:r(60);
                }
                .logo{
                    width: r(97);
                }
            }
            
            
        }
    }
}